<template>
	<view class="wrapper">
		<button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
			<image class="avatar" :src="avatar"></image>
		</button>
		<input type="nickname" class="inp" placeholder="请输入昵称" />
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		ref,
		reactive,
		inject
	} from 'vue'
	import {} from '../../api/index.js'

	const tools = inject("$tools")
	
	let avatar = ref('')
	
	const onChooseAvatar = (e)=>{
		console.log('e',e);
		avatar.value = e.detail.avatarUrl
		// console.log('avatar',avatar.value);
	}
</script>

<style lang="scss" scoped>
	.wrapper{
		padding: 0 100rpx;
		.avatar-wrapper {
			padding: 0;
			width: 200rpx ;
			border-radius: 16rpx;
			margin-top: 80rpx;
			margin-bottom: 80rpx;
			.avatar {
				display: block;
				width: 200rpx;
				height: 200rpx;
			}
		}
		.inp{
			padding: 20rpx;
			border:1px solid #eee;
		}
	}
	

	
</style>